<div class="pm_modal small {{ctrl.class}}" role="dialog" style="display: block;">
    <form class="modal-dialog" name="deleteForm" ng-submit="ctrl.submit()" autocomplete="off" novalidate>
        <button type="button" ng-click="ctrl.cancel()" aria-hidden="true" title-translate="Close" title-translate-context="Action" class="fa fa-times close"></button>
        <div class="modal-content pm_form">
            <div class="modal-header">
                <h4 class="modal-title" translate translate-context="Title">Delete account</h4>
            </div>
            <div class="modal-body">
                <p class="alert alert-warning">
                    <strong translate translate-context="Info" translate-comment="account deletion warning">WARNING: DELETION IS PERMANENT</strong><br />
                    <span translate translate-context="Info">If you wish to delete this account in order to combine it with another one, do NOT delete it. You need to follow</span> <a href="https://protonmail.com/support/knowledge-base/combine-accounts/" target="_blank" translate translate-context="Link">this procedure</a> <span translate translate-context="Info" translate-comment="If you wish to delete this account in order to combine it with another one, do NOT delete it. You need to follow [link] instead">instead</span>.
                </p>

                <p class="alert alert-warning">
                    <strong translate translate-context="Info" translate-comment="account deletion warning">WARNING: THIS ALSO DELETES ALL CONNECTED SERVICES (ex: <i>ProtonVPN</i>)</strong>
                </p>

                <div class="margin" ng-if="ctrl.isAdmin">
                    <label translate translate-context="Label">We are sorry to see you go!</label>
                    <label translate translate-context="Label">Please tell us why you are leaving:</label>
                    <textarea
                        ng-model="ctrl.feedback"
                        placeholder-translate-context="Placeholder"
                        placeholder-translate="Feedback"></textarea>
                </div>
                <div class="margin">
                    <label translate translate-context="Label">Please provide an email address in case we need to contact you (optional):</label>
                    <input
                        type="email"
                        placeholder-translate-context="Placeholder"
                        ng-model="ctrl.email"
                        placeholder-translate="Email" />
                </div>
                <div class="margin">
                    <label translate translate-context="Label">Enter your login password to confirm your identity:</label>
                    <input
                        type="password"
                        placeholder-translate-context="Placeholder"
                        ng-model="ctrl.password"
                        placeholder-translate="Login password" required />
                </div>
                <div class="margin" ng-if="ctrl.hasTwoFactor">
                    <label translate translate-context="Label">Enter two-factor passcode:</label>
                    <two-fa-field
                        ng-model="ctrl.twoFactorCode"
                        placeholder-translate-context="Placeholder"
                        placeholder-translate="Two-factor passcode"></two-fa-field>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="pm_button modal-footer-button" ng-click="ctrl.cancel()" translate-context="Action" translate>Cancel</button>
            <button type="submit" class="pm_button error modal-footer-button disabled-if-network-activity" translate-context="Action" translate>Delete</button>
        </div>
    </form>
    <div class="modal-overlay"></div>
</div>
